{% extends "base.html" %}
{% block title %}
    首页
{% endblock %}
{% block content %}
	<div class="content">
		<div class="content-heading">
			<div class="container">
				<div class="row">
					<div class="col-lg-6 col-lg-push-3 col-sm-10 col-sm-push-1">
						<h1 class="heading">{{ global_title }}</h1>
					</div>
				</div>
			</div>
		</div>
		<div class="container">
			<div class="row">
				<div class="col-lg-6 col-lg-push-3 col-sm-10 col-sm-push-1">
					<section class="content-inner">
                        <p>下面这句话，是否让你受益？ 来源：<a href="https://www.hitokoto.cn">一言</a></p>
						<blockquote>
							<p class="yiyan">一言崩溃了！世界毁灭了！</p>
							<p class="yiyan-auther" align="right">一言崩溃了！世界毁灭了！</p>
						</blockquote>
                    	<div class="card-wrap">
                            <h2 class="content-sub-heading">分类</h2>
                            <div class="row">
                                {% for category in categorys %}
                                <div class="col-lg-4 col-md-4">
                                    <div class="card">
                                        <div class="card-main">
                                            <div class="card-inner">
                                                <p class="card-heading"><a href="{% url 'article:category' id=category.id %}">{{ category.name}}</a></p>
                                                <hr>
                                                <p>{{ category.show }}</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                {% endfor %}
                            </div>
                        </div>
						<h2 class="content-sub-heading">最新文章</h2>
						<div class="tile-wrap">
                            {% for article in article_top %}
							<a class="tile" href="{% url 'article:article' id=article.id %}">
								<div class="tile-inner">
                                    <span>{{ article.title }}</span>
                                    <span style="float:right">作者：{{ article.author }}</span>
                                    <hr>
                                    <pre>{{ article.content | slice:":50" | safe }}</pre>
								</div>
							</a>
                            {% endfor %}
						</div>
					</section>
				</div>
			</div>
		</div>
	</div>
{% endblock %}
{% block js %}
<script src="/static/jquery-3.5.1.min.js"></script>
<script type="text/javascript">
  $.get("https://v1.hitokoto.cn/", function (data, status) {
    if (status == 'success'){
      $('.yiyan').text('『' + data.hitokoto + '』')
      $('.yiyan-auther').text('FROM：' + data.from)
    }else{
      $('.yiyan').text('『' + data.hitokoto + '』')
      $('.yiyan-auther').text('FROM：' + data.from)
    }
  });
</script>
{% endblock %}